import React, { Component } from 'react';
import { NavLink } from 'react-router-dom'

import { connect } from 'react-redux';

class Footer extends Component {
  render() {
    return (
      <footer className='footer'>
          <NavLink to='/home'>
            <span className='iconfont icon-shouye'></span>
            <p>首页</p>
          </NavLink>
          <NavLink to='/kind'>
            <span className='iconfont icon-fenlei'></span>
            <p>分类</p>
          </NavLink>
          <NavLink to='/cart'>
            <span className='iconfont icon-gouwuche'></span>
            <p>购物车</p>
          </NavLink>

          {/* 如果用户已经登录了，那么就显示我的，没有登录就显示请登录 */}
          {/* 获取当前用户有没有登录 */}
          {this.props.loginState
          ?
          (<NavLink to='/user'>
            <span className='iconfont icon-My'></span>
            <p>我的</p>
          </NavLink>)
          :
          (<NavLink to='/login'>
            <span className='iconfont icon-My'></span>
            <p>未登录</p>
          </NavLink>)}




        </footer>
    );
  }
}

export default connect((state)=>{
  return {
    loginState: state.getIn(['user', 'loginState'])
  }
},null)(Footer);
